<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<script type="text/javascript">
        var context_path = "<%=path%>";
    </script>
<script type="text/javascript"
	src="<%=path%>/static/js/techbloom/wms/report/instorage_report.js"></script>
<style type="text/css">
</style>
<div id="grid-div">
	<form id="hiddenForm" action="<%=path%>/inReport/toExcel" method="POST"
		style="display: none;">
		<input id="ids" name="ids" value="" />
	</form>
	<!-- 隐藏区域：存放查询条件 -->
	<form id="hiddenQueryForm" style="display:none;">
		<input name="materialId" id="materialId" value="" /> 
		<input id="warehouseId" name="warehouseId" value=""> 
		<input id="startDate" name="startDate" value=""> 
		<input id="endDate" name="endDate" value="">
	</form>
	<div class="query_box" id="yy" title="查询选项">
            <form id="queryForm" style="max-width:100%;">
			 <ul class="form-elements">
				<li class="field-group field-fluid3">
					<label class="inline" for="startDate" style="margin-right:20px;width:100%;">
						<span class="form_label" style="width:80px;">开始时间：</span>
						   <input class="form-control date-picker" id="startDate" name="startDate" type="text" style="width: calc(100% - 85px);" value="${iv.startDate }"data-date-format="yyyy-mm-dd" placeholder="入库时间" /> 
						 <!--   <span class="input-group-addon"> 
						   <i class="fa fa-calendar bigger-110"></i>
						</span> -->
					</label>			
				</li>
				<li class="field-group field-fluid3">
					<label class="inline" for="endDate" style="margin-right:20px; width:100%;">
						<span class="form_label" style="width:80px;">结束时间：</span>
						<input class="form-control date-picker" id="endDate" name="endDate" type="text" style="width: calc(100% - 85px);" value="${iv.endDate }" data-date-format="yyyy-mm-dd" placeholder="入库时间" /> 
						<!-- <span class="input-group-addon"> 
						   <i class="fa fa-calendar bigger-110"></i>
						</span> -->
					</label>				
				</li>
				<li class="field-group field-fluid3">
					<label class="inline" for="materialId" style="margin-right:20px; width:100%;">
						<span class="form_label" style="width:80px;">物料：</span>
						<input id="materialId" name="materialId" type="text" style="width: calc(100% - 85px);" />
					</label>			
				</li>
				<li class="field-group-top field-group field-fluid3">
					<label class="inline" for="warehouseId" style="margin-right:20px; width:100%;">
						<span class="form_label" style="width:80px;">库区：</span>
						<input type="hidden" id="warehouseId" name="warehouseId" style="width: calc(100% - 85px);"/>
					</label>				
				</li>
				
			</ul>
			<div class="field-button" style="">
					<div class="btn btn-info" onclick="queryOk();">
				        <i class="ace-icon fa fa-check bigger-110"></i>查询
			        </div>
					<div class="btn" onclick="reset();"><i class="ace-icon icon-remove"></i>重置</div>
					<a style="margin-left: 8px;color: #40a9ff;" class="toggle_tools">收起 <i class="fa fa-angle-up"></i></a>
		        </div>
		  </form>		 
    </div>
	<div id="fixed_tool_div" class="fixed_tool_div">
		<div id="__toolbar__" style="float:left;overflow:hidden;"></div>
	</div>
	<table id="grid-table" style="width:100%;height:100%;"></table>
	<div id="grid-pager"></div>
</div>
<script type="text/javascript" src="<%=path%>/plugins/public_components/js/iTsai-webtools.form.js"></script>
<script type="text/javascript">
    var context_path = "<%=path%>";
	var oriData;
	var _grid;
	$(function  (){
        $(".toggle_tools").click();
    });
	$("#__toolbar__").iToolBar({
		id : "__tb__01",
		items : [ {
			label : "导出",
			disabled : (${sessionUser.queryQx} == 1 ? false : true),
			onclick : function() {
				toExcel();
			},
			iconClass : " icon-share"
		} ]
	});
	function querySummaryByParam(jsonParam) {
		iTsai.form.deserialize($("#hiddenQueryForm"), jsonParam);
		var queryParam = iTsai.form.serialize($("#hiddenQueryForm"));
		var queryJsonString = JSON.stringify(queryParam);
		$("#grid-table").jqGrid("setGridParam", {
			postData : {
				queryJsonString : queryJsonString
			}
		}).trigger("reloadGrid");
	}

	$(function() {
		_grid = jQuery("#grid-table").jqGrid({
			url : context_path + "/inReport/list",
			datatype : "json",
			colNames : [ "id", "库区", "物料编号", "物料名称", "单位", "入库数量" ],
			colModel : [ 
			              {name : "id",index : "id",width : 55,hidden : true}, 
			              {name : "warehouseName",index : "warehouseName",width : 48}, 
			              {name : "materialNo",index : "materialNo",width : 48}, 
			              {name : "materialName",index : "materialName",width : 50}, 
			              {name : "materialUnit",index : "materialUnit",width : 20}, 
			              {name : "inAmount",index : "inAmount",width : 30,formatter : "number",formatoptions : {
					              thousandsSeparator : ",",
					              defaulValue : "",
					              decimalPlaces : 2
				                }
			               } 
			],
			rowNum : 20,
			rowList : [ 10, 20, 30 ],
			pager : "#grid-pager",
			sortname : "iod.id",
			sortorder : "asc",
			altRows : true,
			viewrecords : true,
			autowidth : true,
			multiselect : true,
			multiboxonly : true,
			loadComplete : function(data) {
				var table = this;
				setTimeout(function() {
					updatePagerIcons(table);
					enableTooltips(table);
				}, 0);
				oriData = data;
			},
			emptyrecords : "没有相关记录",
			loadtext : "加载中...",
			pgtext : "页码 {0} / {1}页",
			recordtext : "显示 {0} - {1}共{1}条数据"
		});
		jQuery("#grid-table").navGrid("#grid-pager", {
			edit : false,
			add : false,
			del : false,
			search : false,
			refresh : false
		});
		$(window).on(
						"resize.jqGrid",
						function() {
							$("#grid-table").jqGrid("setGridWidth",$("#grid-div").width());							
						});
		$(window).triggerHandler("resize.jqGrid");
	});
	$(function() {
		//初始化时间控件
		$(".date-picker").datepicker({
			autoclose : true,
			todayHighlight : true
		});
	});

	$("#queryForm #materialId").select2({
		placeholder : "选择物料",
		minimumInputLength : 0, //至少输入n个字符，才去加载数据
		allowClear : true, //是否允许用户清除文本信息
		delay : 250,
		formatNoMatches : "没有结果",
		formatSearching : "搜索中...",
		formatAjaxError : "加载出错啦！",
		ajax : {
			url : context_path + "/material/getMaterialSelectList",
			type : "POST",
			dataType : "json",
			delay : 250,
			data : function(term, pageNo) { //在查询时向服务器端传输的数据
				term = $.trim(term);
				return {
					queryString : term, //联动查询的字符
					pageSize : 15, //一次性加载的数据条数
					pageNo : pageNo, //页码
					time : new Date()
				//测试
				}
			},
			results : function(data, pageNo) {
				var res = data.result;
				if (res.length > 0) { //如果没有查询到数据，将会返回空串
					var more = (pageNo * 15) < data.total; //用来判断是否还有更多数据可以加载
					return {
						results : res,
						more : more
					};
				} else {
					return {
						results : {}
					};
				}
			},
			cache : true
		}
	});

	$("#materialId").on("change.select2", function() {
		$("#materialId").trigger("keyup")
	});
	$("#queryForm #warehouseId").select2({
		placeholder : "请选择库区",
		minimumInputLength : 0, //至少输入n个字符，才去加载数据
		allowClear : true, //是否允许用户清除文本信息
		delay : 250,
		formatNoMatches : "没有结果",
		formatSearching : "搜索中...",
		formatAjaxError : "加载出错啦！",
		ajax : {
			url : context_path + "/area/getSelectArea",
			type : "POST",
			dataType : "json",
			delay : 250,
			data : function(term, pageNo) { //在查询时向服务器端传输的数据
				term = $.trim(term);
				return {
					queryString : term, //联动查询的字符
					pageSize : 15, //一次性加载的数据条数
					pageNo : pageNo, //页码
					time : new Date()
				//测试
				}
			},
			results : function(data, pageNo) {
				var res = data.result;
				if (res.length > 0) { //如果没有查询到数据，将会返回空串
					var more = (pageNo * 15) < data.total; //用来判断是否还有更多数据可以加载
					return {
						results : res,
						more : more
					};
				} else {
					return {
						results : {}
					};
				}
			},
			cache : true
		}
	});
	function queryOk() {
		var queryParam = iTsai.form.serialize($("#queryForm"));
		querySummaryByParam(queryParam);
	}
	function reset() {
		$("#queryForm #materialId").select2("data", null).trigger("change");
		$("#queryForm #warehouseId").select2("val","").trigger("change");
		$("#grid-table").jqGrid("setGridParam", {
			postData : {
				queryJsonString : ""
			}
		//发送数据
		}).trigger("reloadGrid");
	}

	$("#queryForm .mySelect2").select2();

	$("#warehouseId").change(function() {
		$("#queryForm #warehouseId").val($("warehouseId").val());
	});

	function toExcel() {
		var idd = jQuery("#grid-table").jqGrid("getGridParam", "selarrrow");
		$("#ids").val(idd);
		$("#hiddenForm").submit();
	}
</script>